<template>
  <el-dialog
    width="600px"
    :visible="visible"
    :lock-scroll="false"
    :destroy-on-close="true"
    custom-class="ele-dialog-form"
    :title="isUpdate?'修改订单监控':'添加订单监控'"
    @update:visible="updateVisible">
    <el-form
      ref="form"
      :model="form"
      size="small"
      label-width="82px">
      <el-row>
        <el-form-item label="订单编号:" prop="order_code" :rules="[{required: true, message: '请输入订单编号', trigger: 'blur'}]">
          <el-input clearable v-model="form.order_code" placeholder="订单编号" :disabled="isUpdate">
            <el-button slot="append" icon="el-icon-search" :loading="searchLoading" @click="searchOrder"></el-button>
          </el-input>
        </el-form-item>
      </el-row>
      <el-row>
        <el-form-item label="外部单号:" prop="out_order_code">
          <el-input clearable v-model="form.out_order_code" :disabled="true"/>
        </el-form-item>
      </el-row>
      <el-row :gutter="20">
        <el-col :sm="12">
          <el-form-item label="票面价:" prop="view_price">
            <el-input clearable v-model="form.view_price" :disabled="true"/>
          </el-form-item>
          <el-form-item label="出发:" prop="dep">
            <el-input clearable v-model="form.dep" :disabled="true"/>
          </el-form-item>
          <el-form-item label="航班号:" prop="flight_no">
            <el-input clearable v-model="form.flight_no" :disabled="true"/>
          </el-form-item>
        </el-col>
        <el-col :sm="12">
          <el-form-item label="销售价:" prop="sale_price">
            <el-input clearable v-model="form.sale_price" :disabled="true"/>
          </el-form-item>
          <el-form-item label="到达:" prop="arr">
            <el-input clearable v-model="form.arr" :disabled="true"/>
          </el-form-item>
          <el-form-item label="仓位:" prop="cabin">
            <el-input clearable v-model="form.cabin" :disabled="true"/>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-form-item label="出发日期:" prop="dep_date">
          <el-input clearable v-model="form.dep_date" :disabled="true"/>
        </el-form-item>
      </el-row>
      <el-row :gutter="20">
        <el-col :sm="12">
          <el-form-item label="监控底价:" prop="monitor_min_price" :rules="[{required: true, message: '请输入监控底价', trigger: 'blur'}]">
            <el-input clearable v-model="form.monitor_min_price" placeholder="监控底价"/>
          </el-form-item>
        </el-col>
        <el-col :sm="12">
          <el-form-item label="监控高价:" prop="monitor_max_price" :rules="[{required: true, message: '请输入监控高价', trigger: 'blur'}]">
            <el-input clearable v-model="form.monitor_max_price" placeholder="监控高价"/>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <div slot="footer">
      <el-button
        @click="updateVisible(false)">取消
      </el-button>
      <el-button
        :disabled="!gnOrderInfo"
        type="primary"
        :loading="loading"
        @click="save">保存
      </el-button>
    </div>
  </el-dialog>
</template>

<script>
export default {
  name: 'monitorOrderEdt',
  props: {
    // 弹窗是否打开
    visible: Boolean,
    // 修改回显的数据
    data: Object
  },
  data() {
    return {
      // 表单数据
      form: Object.assign({}, this.data),
      // 提交状态
      loading: false,
      // 是否是修改
      isUpdate: false,
      searchLoading:false,
      gnOrderInfo:null
    };
  },
  watch: {
    data() {
      if (this.data) {
        this.form = Object.assign({}, this.data);
        this.isUpdate = true;
      } else {
        this.form = {};
        this.isUpdate = false;
      }
    }
  },
  mounted() {

  },
  methods: {
    searchOrder(){
      if(this.form.order_code){
        this.searchLoading = true;
        this.$http.post('/app.monitor.order.gnOrderInfo', {orderCode:this.form.order_code}).then(res => {
          this.searchLoading = false;
          if (res.data.code === 0 && res.data.data) {
            this.gnOrderInfo = res.data.data;
            this.form.out_order_code = this.gnOrderInfo.out_order_code;
            this.form.view_price = this.gnOrderInfo.view_price;
            this.form.sale_price = this.gnOrderInfo.price;
            this.form.dep = this.gnOrderInfo.dep;
            this.form.arr = this.gnOrderInfo.arr;
            this.form.flight_no = this.gnOrderInfo.flight_no;
            this.form.cabin = this.gnOrderInfo.cabin;
            this.form.dep_date = this.gnOrderInfo.dep_date;
          } else {
            this.$message.error(res.data.msg);
          }
        }).catch(e => {
          this.loading = false;
          this.$message.error(e.message);
        });
      }
    },
    /* 保存编辑 */
    save() {
      this.$refs['form'].validate((valid) => {
        if (valid) {
          this.loading = true;
          console.log(this.form);
          this.$http.post('/app.monitor.order.add',{monitor: JSON.stringify(this.form)}).then(res => {
            this.loading = false;
            if (res.data.code === 0) {
              this.$message({type: 'success', message: res.data.msg});
              this.form = {};
              this.gnOrderInfo = null;
              this.updateVisible(false);
              this.$emit('done');
            } else {
              this.$message.error(res.data.msg);
            }
          }).catch(e => {
            this.loading = false;
            this.$message.error(e.message);
          });
        } else {
          return false;
        }
      });
    },
    /* 更新visible */
    updateVisible(value) {
      this.$emit('update:visible', value);
    }
  }
}
</script>

<style scoped>
</style>
